<template>
  <!--  立项导入-->
  <div>
    <!--    :labelCol="({span:0})"-->
    <!--    :wrapperCol="({span:24})"-->
<!--    <searchData
        class="search_import"
        ref="searchCom"
        :search-data="searchArr"
        :refreshCom="false"
        :isExpand="true"
        :rowCount="4"
        @search="search"
    />-->
    <a-card :bordered="false" class="card">
         <span>所属项目：</span>
         <orgTreeSelect
           :auto-selected="false"
           style="width: 20vw;display:inline-block"
           is-maintenance
           allow-clear
           :isNeedAuth="false"
           :isHasChildren="false"
           :is-show-project-status="true"
           :is-search-page="true"
           :is-query-projec-detail="false"
           :check-strictly="false"
           placeholder="请选择项目"
           :need-tags="[]"
           @select="selectPreOrg"
       ></orgTreeSelect>
    </a-card>
    <a-card :bordered="false">
      <b-table
          ref="table"
          class="m-table"
          :showPage="false"
          size="default"
          :scroll="{x: 1200, y: 'calc(50vh)' }"
          :selectConfig="{use: true, type: 'checkbox',rowKey: 'index' }"
          :out-selected-row-keys.sync="outSelectedRowKeys"
          :rowKey="record => record.index"
          :columns="tabColumnsImport"
          :request="loadData"
      >
        <span slot="serial" slot-scope="text, record, index">{{ index + 1 }}</span>
        <!-- 按钮-->
        <ExportExcel
            slot="prefix"
            ref="exportExcel"
            :export-list="exportList"
            :loading="loadingExport"
            icon="export"
            :file-name="'设备清单导入模板.xlsx'"
            button-text="下载导入模板"
            :beforeDownload="beforeDownload"
        />
        <ExcelImportButton
            slot="prefix"
            ref="importExcel"
            :loading.sync="loadingImport"
            icon="import"
            button-text="导入设备清单"
            @handleSubmit="handleImport"
        />

        <a-popconfirm
            slot="prefix"
            title="确定要删除?" @confirm="() => handleRemove()">
          <a-button
              type="primary"
              :disabled="outSelectedRowKeys.length == 0">删除
          </a-button>
        </a-popconfirm>

        <template
            slot="assetNature"
            slot-scope="key, record"
        >
          {{ mapAssetNature(key) }}
        </template>

        <span slot="operation" slot-scope="text, record">
                <a @click="toDetail(record,true)">查看</a>
                <span>
                  <a-divider type="vertical"/>
                  <a @click="toDetail(record,false)">修改</a>
                </span>
        </span>

        <!--  footer-->

        <a-form-model ref="form" :model="form" :rules="rules" class="importCom" slot="footer" layout="inline">
          <a-row type="flex" justify="space-between">
            <a-col span="5">
              <a-form-model-item prop="supplierName" label="供应商"
                                 :labelCol="{style: 'width: 35%'}"
                                 :wrapperCol="{style: 'width: 65%'}">
                <a-input v-model="form.supplierName" placeholder="请输入供应商"/>
              </a-form-model-item>
            </a-col>
            <a-col span="6">
              <a-form-model-item prop="setUpTime" label="立项时间"
                                 :labelCol="{style: 'width: 35%'}"
                                 :wrapperCol="{style: 'width: 65%'}">
                <a-date-picker v-model="form.setUpTime"
                               format="YYYY-MM-DD"
                               value-format="YYYY-MM-DD"
                               autocomplete="off"
                               placeholder="请选择"/>
              </a-form-model-item>
            </a-col>
            <a-col span="10">
              <a-form-model-item label="智慧展厅建设方案"
                                 prop="schemeFile"
                                 :labelCol="{style: 'width: 30%'}"
                                 :wrapperCol="{style: 'width: 70%'}">
                <l-table count="5"
                         style="width: 20vw"
                         :disabled="!editMode"
                         :upload-arrys.sync="form.schemeFile"
                         :business-code="businessCode" />
              </a-form-model-item>
            </a-col>
            <a-col span="3">
              <a-form-model-item>
                <div style="display:flex">
                  <a-button type="primary" @click="submit" :loading="loadingSubmit">提交</a-button>
                  <a-button style="margin-left: 10px" @click="cancel">取消</a-button>
                </div>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </b-table>
    </a-card>
    <EditDrawModal :itemData.sync="itemData" :visible.sync="editModalVisible" :view-mode="viewMode"></EditDrawModal>

  </div>
</template>

<script>
import OrgTreeSelect from '@/components/OrgTreeSelect'
import AssetMixIn from "../assetMixin";
import EditDrawModal from "./EditDrawModal";
import {create,detail} from "@/api/material/assets/assetManage";
import ExportExcel from "@/components/exportExcel/ExportExcel.vue";

export default {
  name: 'AssetImport',
  mixins: [AssetMixIn],
  components: {ExportExcel, EditDrawModal},
  data() {
    return {
      // 加载数据方法 必须为 Promise 对象
      loadData: async (parameter) => {
        return {
          code: 200,
          data: this.queryParamIsEmpty ? this.tableData : this.searchTableData,
          totalSize: this.queryParamIsEmpty ? this.tableData.length : this.searchTableData.length,
        };
      },

      editMode: true
    }
  },
  methods: {
    toDetail(item, viewModel = true) {
      item.orgName = '请选择项目'
      this.itemData = item
      this.viewMode = viewModel
      this.editModalVisible = true
    },
    handleRemove() {
      this.tableData = this.unshift(this.tableData)
      this.searchTableData = this.unshift(this.searchTableData)
      this.$refs.table.refresh(true)
    },

    unshift(arr) { //剔除要删除的item
      let res = []
      for (let i = 0, len = arr.length; i < len; i++) {
        if (!this.outSelectedRowKeys.includes(arr[i].index)) {
          res.push(arr[i])
        }
      }
      return res
    },

    beforeDownload() {
      let columnsExport = this.$clone(this.tabColumnsImport)
      // 若颁证机构枚举值不存在，则添加颁证机构的枚举值
      if (!columnsExport[10].options) {
        this.loadingExport = true
        columnsExport[10].options = [...this.assetNatureMap.values()].filter((item) => item !== '可调拨/已转资产')
        console.log('value==',columnsExport[10].options)
        this.loadingExport = false
      }
      // 设置默认导出配置项
      this.exportList = [
        {
          columns: columnsExport,
          datas: [{}]
        }
      ]
    },

    submit() {
      this.$refs.form.validate((valid, values) => {
        if (!valid) {
          return
        }
        if (this.form.schemeFile.length < 1 ) {
          this.$message.warning('请至少上传1个附件')
          return
        }
        // let orgInfo = this.$refs.searchCom.form.getFieldsValue().org
        // if (orgInfo.orgSet && orgInfo.orgSet.length>0) {
        //   this.$message.warning('请选择项目部，不支持分公司')
        //   this.loadingSubmit = false
        //   return
        // }
        // if (orgInfo.projectSet && orgInfo.projectSet.length===0) {
        //   this.$message.warning('请选择项目')
        //   return
        // }
        if(!this.form.projectId){
          this.$message.warning('请选择项目')
        }
        if (this.tableData.length===0) {
          this.$message.warning('请导入设备清单')
          return
        }

        let params = {
          supplierName: this.form.supplierName,
          setUpTime: this.form.setUpTime,
          fileList: this.form.schemeFile.map((item)=>item.commonId),
          list: this.tableData,
          projectSet:[this.form.projectId]
          // ...orgInfo
        }
        this.loadingSubmit = true
        create(params).then((res)=>{
          this.$message.warning('立项成功！')
          this.loadingSubmit = false
          this.cancel()
        }).catch((e) =>{
          this.loadingSubmit = false
          this.$message.warning('立项失败！')
        })
      })
    },
    cancel() {
      this.$multiTab.closeIframe(this.$route.path)
    }
  }
}

</script>


<style scoped lang="less">

/deep/ .search_import .treeOrgBox  .ant-input{
  border-color: #e4ac0b;
  background-color: #fff9e8;
}
/deep/ .card  .ant-input{
  border-color: #e4ac0b;
  background-color: #fff9e8;
}
/deep/ .importCom  .ant-input{
  border-color: #e4ac0b;
  background-color: #fff9e8;
}
/deep/ .card  .treeOrgBox .searchIcon{
  top: 6px;
}

.importCom /deep/ .ant-form-item-label {
  text-align: left;
}

.importCom /deep/ .ant-upload-list {
  float: right;
}
.m-table /deep/ .ant-table-body {
  min-height: 50vh;
}

/deep/ .ant-card-body table{
  margin-left: 0;
  margin-right: 0;
}

/deep/ .ant-table-row .ant-table-row-cell-break-word{
  overflow:hidden;
  text-overflow:ellipsis;//溢出部分用省略号代替
  -webkit-line-clamp:1; //设置文本显示1行，想要几行把1替换掉就行
  display: table-cell !important; //将对象作为弹性伸缩盒子模型显示;

  white-space:nowrap;
  word-break: break-all;
}
/deep/ .ant-table-row-cell-last{
  width: 95px;
}
</style>